<?php
include("../includes/common.php");
$title = '上传文件 - '.$conf['title'];
if($conf['forcelogin']==1 && !$islogin2) {loginsmsg('请登录后再操作！');}
include './head.php';
$csrf_token = md5(mt_rand(0,999).time());
$_SESSION['csrf_token'] = $csrf_token;
?>

<div class="layui-fluid">
  <div class="layui-row layui-col-space15">
    <div class="layui-col-md8 layui-col-sm12">
      <div class="layui-card">
        <div class="layui-card-header">文件上传</div>
        <div class="layui-card-body">
          <input type="hidden" id="csrf_token" name="csrf_token" value="<?php echo $csrf_token?>">

          <!-- Vue 挂载点：保留 uploadnew.js 原有选择器和逻辑 -->
          <div id="app">
            <div class="upload-area" id="fileInput" style="border:1px dashed #e6e6e6;padding:24px;text-align:center;border-radius:6px;">
              <i class="layui-icon layui-icon-upload" style="font-size:36px;color:#01AAED"></i>
              <p class="upload-title" style="font-size:18px;margin-top:8px;">选择文件/Ctrl+V粘贴/拖拽到此上传</p>
              <p class="muted">支持单文件上传，保持原有上传逻辑（MD5秒传、分片/直传、完成回调）。</p>

              <!-- 隐藏的文件输入（uploadnew.js 期望 id=file） -->
              <!-- 把 input 放入 label 中，单个按钮：选择文件上传，选中文件后立即触发 uploadnew.js 的 change 事件 -->
              <label class="layui-btn layui-btn-normal" style="position:relative;overflow:hidden;">
                选择文件上传
                <input type="file" id="file" style="position:absolute;left:0;top:0;opacity:0;width:100%;height:100%;cursor:pointer;" />
              </label>
            </div>

            <div id="uploadList" style="margin-top:16px;"></div>

            <div class="layui-card" style="margin-top:16px;" v-if="showtype==2">
              <div class="layui-card-body">
                <div class="alert">{{alert.msg}}</div>
              </div>
            </div>
          </div>
          <!-- /#app -->

        </div>
      </div>

      <div class="layui-card" style="margin-top:16px;">
        <div class="layui-card-header">上传历史（本次会话）</div>
        <div class="layui-card-body">
          <ul class="layui-timeline" id="historyTimeline"></ul>
        </div>
      </div>
    </div>

    <div class="layui-col-md4 layui-col-sm12">
      <div class="layui-card">
        <div class="layui-card-header">上传选项</div>
        <div class="layui-card-body">
          <form class="layui-form" lay-filter="uploadOptions">
            <div class="layui-form-item">
              <label class="layui-form-label">显示方式</label>
              <div class="layui-input-block">
                <input type="checkbox" name="show" lay-skin="switch" lay-text="显示|隐藏" id="opt_show" />
              </div>
            </div>

            <div class="layui-form-item">
              <label class="layui-form-label">下载密码</label>
              <div class="layui-input-block">
                <input type="checkbox" id="opt_ispwd" lay-skin="switch" lay-text="启用|关闭" lay-filter="opt_ispwd" />
              </div>
            </div>
            <div class="layui-form-item" id="pwd_box" style="display:none;">
              <label class="layui-form-label">密码</label>
              <div class="layui-input-block">
                <input type="text" id="opt_pwd" class="layui-input" placeholder="字母或数字" />
              </div>
            </div>

            <div class="layui-form-item">
              <label class="layui-form-label">最大单文件</label>
              <div class="layui-input-block">
                <p class="muted"><?php echo ($conf['upload_size']>0? $conf['upload_size'].' MB':'无限制')?></p>
              </div>
            </div>

            <div class="layui-form-item">
              <label class="layui-form-label">视频审核</label>
              <div class="layui-input-block">
                <p class="muted"><?php echo ($conf['videoreview']==1?'需要审核':'无需审核')?></p>
              </div>
            </div>

          </form>
        </div>
      </div>

      <div class="layui-card" style="margin-top:16px;">
        <div class="layui-card-header">上传须知</div>
        <div class="layui-card-body">
          <ul class="layui-list">
            <li>请勿上传违反法律法规的内容。</li>
            <li>系统会对图片进行绿色检测，命中则标记并限制显示。</li>
            <li>仅支持单文件上传（UI 限制），请分次上传多个文件。</li>
          </ul>
        </div>
      </div>
    </div>
  </div>
</div>
<?php include 'foot.php';?>

<!-- 载入 jQuery、Vue 与 脚本依赖，然后原上传逻辑脚本（保持不变） -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/spark-md5@3.0.2/spark-md5.min.js"></script>
<script>
// 提供 upload_max_filesize 变量供 uploadnew.js 使用（单位 MB）
var upload_max_filesize = '<?php echo $conf['upload_size']>0?intval($conf['upload_size']):"";?>';
</script>
<script src="../assets/js/uploadnew.js?v=<?php echo VERSION;?>"></script>

<script>
// 兼容：页面加载完成后再绑定事件，避免元素未创建导致 null
(function(){
  function initBindings(){
    // 如果 layui 可用，渲染表单交互
    if(window.layui && typeof layui.use === 'function'){
      try{ layui.use(['form'], function(){ layui.form.render(); layui.form.on('switch(opt_ispwd)', function(data){ if(data.elem.checked){ document.getElementById('pwd_box').style.display='block'; } else { document.getElementById('pwd_box').style.display='none'; document.getElementById('opt_pwd').value=''; } }); }); }catch(e){ console.error('layui form init error', e); }
    }

    var uploadBtn = document.getElementById('uploadFile');
    if(uploadBtn){ uploadBtn.addEventListener('click', function(){ var fileInput = document.getElementById('file'); if(fileInput) fileInput.click(); }); }

    var fileInputEl = document.getElementById('file');
    if(fileInputEl){
      fileInputEl.addEventListener('change', function(e){
        // 选中文件后立即触发 uploadnew.js 中的处理
        try{
          if(window.UPLOAD_APP && typeof window.UPLOAD_APP.selectFile === 'function'){
            window.UPLOAD_APP.selectFile({ target: this });
          }else{
            // 如果 UPLOAD_APP 不可用，调用全局兼容处理：构造 FileList-like target
            var evt = { target: this };
            if(typeof selectFile === 'function') selectFile(evt);
          }
        }catch(err){ console.error('file change handler error', err); }
      });
    }

    var btnUpload = document.getElementById('btnUpload');
    if(btnUpload){ btnUpload.addEventListener('click', function(){ var fileInput = document.getElementById('file'); if(!fileInput || !fileInput.files || fileInput.files.length==0){ if(window.layer) layer.msg('请先选择文件'); else alert('请先选择文件'); return; } try{ if(window.UPLOAD_APP && typeof window.UPLOAD_APP.selectFile==='function'){ window.UPLOAD_APP.selectFile({ target: fileInput }); } }catch(e){ console.error(e); } }); }
  }

  if(document.readyState === 'loading') document.addEventListener('DOMContentLoaded', initBindings); else initBindings();
})();
</script>